<template>
	<view>
		<view class="box_good flex_r_between" v-if="list.length">
			<view class="item" v-for="item in list" :key='item.id'>
				<view class="img">
					<image style="width: 325rpx;height: 325rpx;border-radius: 10rpx;" :src="item.thumbnail.replace(/\\/g,'/')" mode=""></image>
				</view>
				<view class="name text_ellipsis" style="text-align: center;">
					{{item.name}}
				</view>
				<view class="price">
					<text class="t">¥{{item.retailPrice}} + </text>
					<text style="margin: 0 0 0 5rpx;">{{item.maxScore}}积分 </text>
				</view>
				<view class="btn flex_coum_center" @click="$go('./good-detail?id=' + item.id)">
					立即抢购
				</view>
			</view>
		</view>
		<view class="nodata flex_center" v-else>
			~暂无数据~
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[],
				pageIndex:1,
				pageSize:10,
				finish:false,
				info:{}
			};
		},
		methods:{
			getlist() {
				if(this.info.id){
					this.$ajax('api/Shop/QueryGoodsByCategory', { pageIndex: this.pageIndex, pageSize: this.pageSize,id:this.info.id ? this.info.id : '' }).then(res => {
						if (res.Data.list.length) {
							this.list = this.list.concat(
								res.Data.list.map(item => {
									item.checked = false;
									return item;
								})
							);
							this.pageIndex++;
							this.finish = false;
						} else {
							this.finish = true;
						}
						uni.hideLoading();
					});
				}else if(this.info.lk){
					this.$ajax('api/Main/QueryGoods', { pageIndex: this.pageIndex, pageSize: this.pageSize,id:this.info.id ? this.info.id : '' }).then(res => {
						if (res.Data.list.length) {
							this.list = this.list.concat(
								res.Data.list.map(item => {
									item.checked = false;
									return item;
								})
							);
							this.pageIndex++;
							this.finish = false;
						} else {
							this.finish = true;
						}
						uni.hideLoading();
					});
				}else{
					this.$ajax('api/Shop/QueryMainGoods', { pageIndex: this.pageIndex, pageSize: this.pageSize,id:this.info.id ? this.info.id : '' }).then(res => {
						if (res.Data.list.length) {
							this.list = this.list.concat(
								res.Data.list.map(item => {
									item.checked = false;
									return item;
								})
							);
							this.pageIndex++;
							this.finish = false;
						} else {
							this.finish = true;
						}
						uni.hideLoading();
					});
				}
			}
		},
		onShow() {
			this.list = []
			this.pageIndex = 1
			this.getlist()
		},
		onLoad(e) {
			this.info = e.item ? JSON.parse(e.item) : {},
			console.log(e)
			uni.setNavigationBarTitle({
				title:e.item ? JSON.parse(e.item).name : '商品列表'
			})
		},
	onReachBottom() {
		uni.showLoading({
			title: '加载中'
		});
		if (!this.finish) {
			this.getlist();
		}else{
			uni.hideLoading()
		}
	}
	}
</script>

<style lang="less">

.box_good{
	display: flex;
	flex-wrap: wrap;
	margin: 0 30rpx;
	.item{
		width: 47%;
		margin: 0 0 62rpx 0;
		// &:nth-child(2n){
		// margin: 0 0 62rpx 0;
		// }
		.img{
			width: 100%;
			border-radius: 5px;
		}
		.name{
			width: 100%;
			font-size: 28rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #000033;
			line-height: 48rpx;
			-webkit-line-clamp: 2;
			margin: 30rpx 0 10rpx;
		}
		.price{
			font-size: 28rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			line-height: 48rpx;
			color: #E0BC60;
			text-align: center;
			&>.t{
				color: #333333;
			}
		}
		.btn{
			width: 100%;
			height: 71rpx;
			background: #FFFFFF;
			border: 1px solid #333333;
			border-radius: 3rpx;
			font-size: 26rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #333333;
			margin: 20rpx 0 0;
		}
	}
}
</style>
